import { useModel } from "@umijs/max"
import { Button, Card, Select, Space } from "antd"
import { useState } from "react"

const { Option } = Select

// 定义测试的弹窗类型
interface ModalTest {
  label: string
  value: string
}

const modalTests: ModalTest[] = [
  {
    label: "Notification Modal Test",
    value: "Notification"
  },
  {
    label: "StartProduce Modal Test",
    value: "StartProduce"
  }
]

const TestPyApi: React.FC = () => {
  const { callPy } = useModel("websocketModel")
  const [selectedModal, setSelectedModal] = useState<string>(modalTests[0].value)

  // 测试弹窗
  const handleTest = async () => {
    const selectedTest = modalTests.find((test) => test.value === selectedModal)
    if (selectedTest) {
      await callPy("testHdr", "show_test_modal_from_web", [selectedTest.value])
    }
  }

  return (
    <Card title="Python API 测试">
      <Space direction="vertical" style={{ width: "100%" }}>
        <Space>
          <Select
            style={{ width: 300 }}
            value={selectedModal}
            onChange={(value) => setSelectedModal(value)}
          >
            {modalTests.map((test) => (
              <Option key={test.value} value={test.value}>
                {test.label}
              </Option>
            ))}
          </Select>
          <Button type="primary" onClick={handleTest}>
            测试弹窗
          </Button>
        </Space>
      </Space>
    </Card>
  )
}

export default TestPyApi
